    #cesiumContainer {
        height: 100%;
        width: 100%;
    }
    
    #basicToolbar {
        position: absolute;
        right: 12px;
        top: 61px;
        width: 32px;
        z-index: 999;
    }
    
    #spatialToolBar {
        position: absolute;
        right: 44px;
        top: 60px;
        z-index: 999;
    }
    
    .basicToolMenu {
        width: 32px;
        height: 32px;
        margin: 4px 4px;
        cursor: pointer;
        background-repeat: no-repeat;
        background-position: center;
        /* border: solid 1px #458ac9; */
        border-radius: 5px;
        background-color: #303336;
        display: inline-block;
    }
    
    .basicToolMenu:hover {
        box-shadow: rgb(11 234 235) 0px 0px 18px inset;
    }
    
    .logo {
        float: left;
        line-height: 60px;
        padding: 0px 20px;
        height: 60px;
    }
    
    .logo img {
        width: 32px;
        height: 32px;
    }
    
    .logo span {
        font-size: 24px;
        padding-left: 20px;
        color: white;
    }
    
    .btn-layertree-ctrl {
        display: inline-block;
        position: absolute;
        right: 44px;
        top: 66px;
        cursor: pointer;
        background: #303336;
        border-radius: 4px;
    }
    
    .btn-layertree-ctrl img {
        width: 30px;
        height: 30px;
    }
    
    .header-bar {
        height: 64px;
        width: 100%;
        display: inline-block;
        position: absolute;
        z-index: 8001;
        background: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 0.05))
    }
    
    .header-bar .site-logo {
        display: inline-block;
        width: 30%;
        height: 100%;
        vertical-align: top;
        position: relative;
    }
    
    .header-bar .site-logo img {
        display: inline-block;
    }
    
    .header-bar .site-logo .imgLogo {
        margin-top: 10px;
        margin-left: 10px;
        position: absolute;
        height: 60%;
        z-index: 999;
    }
    
    .header-bar .site-logo .imgLogoBg {
        height: 120%;
        position: absolute;
    }
    
    .header-bar .site-title {
        display: inline-block;
        height: 100%;
        vertical-align: top;
        position: absolute;
        margin-left: 90px;
    }
    
    .header-bar .site-title span {
        font-size: 36px;
        display: block;
        padding-left: 8px;
        font-weight: 700;
        color: floralwhite;
        cursor: pointer;
        font-family: "Microsoft Himalaya";
        font-style: italic;
    }
    
    .header-bar .site-menus {
        display: inline-block;
        width: 55%;
        height: 100%;
        vertical-align: top;
    }
    
    .site-menus .site-menu {
        min-width: 60px;
        height: 100%;
        display: inline-block;
        vertical-align: top;
        padding-left: 4px;
        padding-right: 4px;
        float: right;
    }
    
    .site-menus .site-menu-split {
        min-width: 1px;
        height: 100%;
        display: inline-block;
        float: right;
        margin-left: 4px;
    }
    
    .site-menus .site-menu-split a {
        display: inline-block;
        line-height: 20px;
        background: #ffffff52;
        vertical-align: bottom;
        height: 20px;
        margin-top: 30px;
        width: 2px;
    }
    
    .site-menus .site-menu a {
        cursor: pointer;
        text-shadow: 0 0 10px #ffffff45, 0 0 10px #ffffff40, 0 0 10px #ffffff45, 0 0 20px #ffffff73;
        border-bottom: 1px solid #ffffff52;
        display: inline-block;
        line-height: 20px;
        vertical-align: bottom;
        height: 20px;
        margin-top: 32px;
        font-size: 16px;
        color: white;
        -webkit-user-select: none;
        user-select: none;
        font-family: 黑体;
    }
    
    .site-menus .site-menu a:hover {
        border-bottom: 4px solid #ffffff52;
        text-shadow: 0 0 10px white, 0 0 20px white, 0 0 30px white, 0 0 40px white;
    }
    
    .header-bar .site-login {
        display: inline-block;
        float: right;
        height: 100%;
        vertical-align: top;
        margin-right: 10px;
        margin-top: -10px;
    }
    
    .header-bar .datetime {
        display: inline-block;
        float: right;
        vertical-align: bottom;
        margin-right: 10px;
        margin-top: 15px;
    }
    
    .datetime .time {
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        font-size: 16px;
        text-align: right;
        color: #fff;
        vertical-align: bottom;
        font-weight: bold;
    }
    
    .datetime .time:hover,
    .datetime .date:hover {
        border-bottom: 1px solid #2ac2fc;
        cursor: pointer;
    }
    
    .datetime .date {
        font-family: Verdana, Geneva, Tahoma, sans-serif;
        font-size: 12px;
        text-align: right;
        color: #fff;
        vertical-align: top;
    }
    
    .header-bar .site-login div {
        margin-top: 16px;
        cursor: pointer;
    }
    
    .header-bar .site-login div svg {
        float: right;
        margin-top: 10px;
        width: 24px;
    }
    
    .header-bar .site-login div span {
        cursor: pointer;
        float: right;
        margin-top: 16px;
        margin-left: 2px;
        color: #b7aeae;
        font-size: 14px;
        border-bottom: 1px solid #d2d2d2;
    }
    
    #cesiumContainer {
        width: 100%;
        height: 100%;
        background: lightblue;
        top: 0px;
        left: 0px;
    }
    
    .bottom-bar {
        position: absolute;
        bottom: -50px;
        height: 120px;
        width: 740px;
        left: calc(50% - 370px);
        border-radius: 60px;
    }
    
    .bottom-bar-item {
        display: inline-block;
        height: 46px;
        width: 46px;
        margin-left: 16px;
        border: 4px solid transparent;
        border-radius: 60px;
        cursor: pointer;
    }
    
    .bottom-bar-item svg {
        margin-left: 7px;
    }
    
    .bottom-bar-item span {
        font-size: 12px;
        display: block;
        width: 50px;
        margin-left: -2px;
        color: #fdfdf9;
        user-select: none;
        -webkit-user-select: none;
    }
    
    .bottom-bar-item div {
        width: 46px;
        height: 46px;
    }
    
    .bottom-bar-item-fs {
        background-image: url('../images/toolbars/fullscreen.png');
        ;
    }
    
    .bottom-bar-item-fs:hover {
        background-image: url('../images/toolbars/fullscreen-2.png');
    }
    
    .bottom-bar-item-ps {
        background-image: url('../images/toolbars/ps.png');
    }
    
    .bottom-bar-item-ps:hover {
        background-image: url('../images/toolbars/ps-2.png');
    }
    
    .bottom-bar-item-dis {
        background-image: url('../images/toolbars/dis.png');
    }
    
    .bottom-bar-item-dis:hover {
        background-image: url('../images/toolbars/dis-2.png');
    }
    
    .bottom-bar-item-area {
        background-image: url('../images/toolbars/area.png');
    }
    
    .bottom-bar-item-area:hover {
        background-image: url('../images/toolbars/area-2.png');
    }
    
    .bottom-bar-item-area:hover {
        background-image: url('../images/toolbars/area-2.png');
    }
    
    .bottom-bar-item-height {
        background-image: url('../images/toolbars/height.png');
    }
    
    .bottom-bar-item-height:hover {
        background-image: url('../images/toolbars/height-2.png');
    }
    
    .bottom-bar-item-clear {
        background-image: url('../images/toolbars/clear.png');
    }
    
    .bottom-bar-item-clear:hover {
        background-image: url('../images/toolbars/clear-2.png');
    }
    
    .bottom-bar-item-spatial {
        background-image: url('../images/toolbars/spatial.png');
    }
    
    .bottom-bar-item-spatial:hover {
        background-image: url('../images/toolbars/spatial-2.png');
    }
    
    .bottom-bar-item-kwfx {
        background-image: url('../images/toolbars/kwfx.png');
    }
    
    .bottom-bar-item-kwfx:hover {
        background-image: url('../images/toolbars/kwfx-2.png');
    }
    
    .bottom-bar-item-yxkw {
        background-image: url('../images/toolbars/yxkw.png');
    }
    
    .bottom-bar-item-yxkw:hover {
        background-image: url('../images/toolbars/yxkw-2.png');
    }
    
    .bottom-bar-item-layers {
        background-image: url('../images/toolbars/layers.png');
    }
    
    .bottom-bar-item-layers:hover {
        background-image: url('../images/toolbars/layers-2.png');
    }
    
    .bottom-bar-item:hover span {
        font-weight: 700;
        color: #2ac2fc;
    }
    
    .cesium-viewer-navigationContainer {
        display: block;
        position: absolute;
        top: 64px;
        right: 0;
        padding: 0;
        -moz-box-sizing: content-box;
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
        height: 300px;
        width: 128px;
    }
    
    #layerTreePanel {
        padding-top: 5px;
        padding-bottom: 5px;
    }
    
    #layerTreePanel .layui-icon-file::before {
        content: "\e656";
        color: #2ac2fc;
    }
    
    .lay-tab {
        margin: 0px;
    }
    
    .drawCur {
        cursor: url(../images/draw.cur), auto;
    }
    
    blockquote .infoBoxAttrName {
        display: inline-block;
        width: 60px;
        overflow: hidden;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    
    blockquote .infoBoxAttrValue {
        display: inline-block;
        width: 80px;
        overflow-x: hidden;
        text-align: left;
        padding-left: 5px;
    }
    
    blockquote .infoContent {
        overflow-y: hidden;
        max-height: 200px;
    }
    
    blockquote .infoContent:hover {
        overflow-y: auto;
    }
    
    blockquote .infoBoxAttrSplit {
        display: inline-block;
    }
    
    blockquote .infoItem {
        border-bottom: 1px solid #92b9f8;
        padding: 5px;
    }
    
    .logoImage {
        background-image: url(/static/maps/images/logo.png);
        width: 200px;
        display: inline-block;
        height: 60px;
        background-repeat: no-repeat;
        background-position: center;
        margin-left: 200px;
    }
    
    #load_bg {
        width: 100%;
        height: 100%;
        position: fixed;
        background: rgba(0, 0, 0, 0.9);
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 9999;
    }
    
    .load_box {
        width: 200px;
        height: 200px;
        position: fixed;
        left: 50%;
        top: 50%;
        margin: 0px auto;
        z-index: 9999;
        margin-top: -100px;
    }
    
    .load_box>.load {
        align-items: center;
        justify-content: center;
    }
    
    .load_box>.load>.loading>i {
        display: inline-block;
        width: 5px;
        height: 30px;
        border-radius: 3px;
        background: #eee;
        margin: 0 3px;
    }
    
    .load_box>.load>.loading>i:nth-child(1) {
        animation: loading-2 1s linear 0s infinite;
        -o-animation: loading-2 1s linear 0s infinite;
        -moz-animation: loading-2 1s linear 0s infinite;
        -webkit-animation: loading-2 1s linear 0s infinite;
    }
    
    .load_box>.load>.loading>i:nth-child(2) {
        animation: loading-2 1s ease-in 0.2s infinite;
        -o-animation: loading-2 1s ease-in 0.2s infinite;
        -moz-animation: loading-2 1s ease-in 0.2s infinite;
        -webkit-animation: loading-2 1s ease-in 0.2s infinite;
    }
    
    .load_box>.load>.loading>i:nth-child(3) {
        animation: loading-2 1s ease-in 0.4s infinite;
        -o-animation: loading-2 1s ease-in 0.4s infinite;
        -moz-animation: loading-2 1s ease-in 0.4s infinite;
        -webkit-animation: loading-2 1s ease-in 0.4s infinite;
    }
    
    .load_box>.load>.loading>i:nth-child(4) {
        animation: loading-2 1s ease-in 0.8s infinite;
        -o-animation: loading-2 1s ease-in 0.8s infinite;
        -moz-animation: loading-2 1s ease-in 0.8s infinite;
        -webkit-animation: loading-2 1s ease-in 0.8s infinite;
    }
    
    .load_box>.load>.loading>i:nth-child(5) {
        animation: loading-2 1s ease-in 1s infinite;
        -o-animation: loading-2 1s ease-in 1s infinite;
        -moz-animation: loading-2 1s ease-in 1s infinite;
        -webkit-animation: loading-2 1s ease-in 1s infinite;
    }
    
    @-webkit-keyframes loading-2 {
        0% {
            transform: scaleY(1);
            -o-transform: scaleY(1);
            -ms-transform: scaleY(1);
            -moz-transform: scaleY(1);
            -webkit-transform: scaleY(1);
        }
        50% {
            transform: scaleY(0.4);
            -o-transform: scaleY(0.4);
            -ms-transform: scaleY(0.4);
            -moz-transform: scaleY(0.4);
            -webkit-transform: scaleY(0.4);
        }
        100% {
            transform: scaleY(1);
            -o-transform: scaleY(1);
            -ms-transform: scaleY(1);
            -moz-transform: scaleY(1);
            -webkit-transform: scaleY(1);
        }
    }
    
    .head-menus {
        width: 280px;
        height: 100%;
        line-height: 100%;
        display: inline-block;
        position: relative;
        margin: 15px 0px;
        cursor: pointer;
    }
    
    .head-menus span {
        display: inline-block;
        background-image: url();
        background-size: 100% 100%;
        height: 40%;
        width: 130px;
        text-align: center;
    }
    
    .head-menus-menu-select {
        background-image: url("") !important;
    }
    
    .head-menus span:hover {
        background-image: url("");
    }
    
    .head-menus span a {
        font-size: 15px;
        display: block;
        height: 20px;
        margin: 6px 0px;
        color: white;
        font-family: yahei;
    }
    
    .q-s-icon {
        position: absolute;
        height: 38px;
        width: 160px;
        background: #33333366;
        top: 80px;
        left: 100px;
    }
    
    .q-s-type {
        position: absolute;
        width: 400px;
        top: 120px;
        left: 100px;
        padding: 6px;
        background-color: #061F30af;
    }
    
    .q-title-in-Sub span {
        color: #2AC2FC;
        margin-left: 5px;
        font-weight: bold;
        font-family: "Microsoft YaHei UI";
    }
    
    .q-title-in-Sub-img {
        display: inline-block;
        width: 5px;
        height: 12px;
        background-image: url("");
    }
    
    .q-title-in-Sub-title {
        display: inline-block;
        padding-left: 5px;
    }
    
    .query-type-enum div {
        display: inline-block;
        font-size: 14px;
        font-family: "Microsoft Yahei Regular";
        border: 1px solid white;
        padding: 4px 8px;
        margin: 6px;
        color: #ffffff;
        cursor: pointer;
        text-align: center;
    }
    
    .query-type-enum-select {
        color: #E4B855 !important;
        border-color: #E4B855 !important;
    }
    
    .query-type-enum div:hover {
        color: #E4B855;
        border-color: #E4B855;
    }
    
    .queryTypes {
        padding-left: 5px;
    }
    
    .queryTypes-title {
        padding: 6px;
    }
    
    .queryTypes-title span {
        font-family: "Microsoft YaHei Bold";
        font-size: 14px;
        color: #FFFFFF;
    }
    
    .queryConditionsContainer {
        min-height: 10px;
        padding-top: 10px;
    }
    
    .query-hide {
        display: none;
    }
    
    #cdts-ctrl img {
        cursor: pointer;
    }
    
    .queryConditionsContainer .layui-form-item label {
        float: left;
        display: block;
        width: 80px;
        font-weight: 400;
        text-align: left;
        font-size: 14px;
        color: white;
        padding-left: 6px;
    }
    
    .queryConditionsContainer .layui-form-item .layui-input-block {
        margin-left: 102px;
        min-height: 36px;
    }
    
    .queryConditionsContainer #query,
    .queryConditionsContainer #tj {
        background-image: linear-gradient(#04374C99, #177BA399);
        height: 30px;
        line-height: 30px;
        margin-top: 4px;
    }
    
    .queryConditionsContainer [type='reset'] {
        background-image: linear-gradient(#FFFFFF66, #FFFFFF66);
        height: 30px;
        line-height: 30px;
        margin-top: 4px;
    }
    
    .queryConditionsContainer [class~='layui-form-item'] {
        margin-bottom: 0px;
    }
    
    .queryConditionsContainer [lay-skin='primary'] span {
        color: #FFFFFF;
    }
    
    .queryConditionsContainer [class~='layui-form-radio'] {
        color: #FFFFFF;
    }
    
    .qs-hidden {
        display: none;
    }

    #panel-result{
        height:100% !important;
    }